<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>call</title>
    <style>
        body {
            display: flex;
            justify-content: center;
            align-items: center;
            min-height: 100vh;
        }

        #results li.pass {
            flex: 0;
            color: green;
        }

        #results li.fail {
            flex: 0;
            color: red;
            text-decoration: line-through;
        }
    </style>
</head>
<body>

<div id="results"></div>

<script>

    function assert(value, desc) {
        let li = document.createElement('li');
        li.className = value ? 'pass' : 'fail';
        li.appendChild(document.createTextNode(desc));
        document.getElementById('results').appendChild(li);
    }

    //    function creep() {
    //        return this;
    //    }
    //    assert(creep() === window, 'Creeping in the window');
    //    let sneak = creep;
    //    assert(sneak() === window, 'Sneaking in the window');
    //    let ninja1 = {skulk:creep};
    //    assert(ninja1.skulk() === ninja1, 'The 1st ninja is skulking');
    //    let ninja2 = {skulk:creep};
    //    assert(ninja2.skulk() === ninja2, 'The 2nd ninja is skulking')

    function Ninja() {
        this.skulk = function () {
            return this;
        };
    }
    let ninja1 = new Ninja();
    let ninja2 = new Ninja();
    assert(ninja1.skulk() === ninja1, 'The 1st ninja is skulking');
    assert(ninja2.skulk() === ninja2, 'The 2nd ninja is skulking');

    function juggle() {
        let result = 0;
        for (let n = 0; n < arguments.length; n++) {
            result += arguments[n];
        }
        this.result = result;
    }

    let ninja1 = {};
    let ninja2 = {};

    juggle.apply(ninja1, [1, 2, 3, 4]);
    juggle.call(ninja2, 5, 6, 7, 8);

    assert(ninja1.result === 10, 'juggled via apply');
    assert(ninja2.result === 26, 'juggled via call');


    function forEach(list, callback) {
        for (let n = 0; n < list.length; n++) {
            callback.call(list[n], n)
        }
    }
    let weapons = ['goods', 'ratings', 'sellers'];
    forEach(weapons, function (index) {
        assert(this == weapons[index], 'Got the expected value of ' + weapons[index])
    })


</script>
</body>
</html>